<template>
  <div id="shoplist"> 

          <el-table :data="datalist" style="width: 100%" :height="dtheight" :header-cell-style="{background:'#4F81BC',color:'white'}"
           :row-class-name="tableRowClassName"  :border="true">

                <el-table-column label="产品名称"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.pname }}</span>
                    </template>
                </el-table-column>  
                <el-table-column label="封面图"  align='center' >                   
                    <template slot-scope="scope">                   
                       <img  style="width: 30px; height: 30px" :src="urlimg + scope.row.thumbnail" /> 
                    </template>
                </el-table-column> 
                 <el-table-column label="价格"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.price }}</span>
                    </template>
                </el-table-column> 
                 <el-table-column label="月销"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.sale_count }}</span>
                    </template>
                </el-table-column> 
                 <el-table-column label="规格详情"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span  class="see_span" @click="mtk1_but(scope.row)"><i class="el-icon-view el-icon--right"></i></span>
                    </template>
                </el-table-column> 
                <el-table-column label="上下架"  align='center' >                   
                    <template slot-scope="scope">                   
                       <span >
                           <el-switch  
                            :active-value="active" 
                            :inactive-value="isactive" 
                            v-model="scope.row.status" 
                            @change="switchchange(scope.row)"  
                            active-color="#F5CF49" 
                            inactive-color="#E5E5E5"> 
                         </el-switch>
                       </span>
                    </template>
                </el-table-column>
                 <el-table-column label="操作" align='center' width="200px">
                    <template slot-scope="scope"> 
                        <el-button size="mini"  type="primary" class="button_class1" plain  @click="go_but(scope.row)">修改</el-button> 
                        <el-button size="mini"  type="primary" class="button_class2" plain @click="delect_but(scope.row)">删除</el-button> 
                    </template>
                </el-table-column>        

            </el-table>  

        
         <!-- 查看规格-->
        <el-dialog title="查看规格" :visible.sync="mtk1"  width="700px">
            <div style="width:100%;"> 

             <el-table :data="mtk1_form.datalist" style="width: 100%" height="500px" :header-cell-style="{background:'#4F81BC',color:'white'}"
           :row-class-name="tableRowClassName"  :border="true">
                
                 <el-table-column label="规格名称"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.ename }}</span>
                    </template>
                </el-table-column>
                 <el-table-column label="价格"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.price }}</span>
                    </template>
                </el-table-column>
                 <el-table-column label="库存"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.count }}</span>
                    </template>
                </el-table-column>
                 <el-table-column label="规格图片"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span ><img :src="urlimg + scope.row.cover"  class="img" style="width:40px; height:40px;" /></span>
                    </template>
                </el-table-column>
                 

            </el-table> 


            </div> 
        </el-dialog>

          

   </div>
</template>

<script>

export default {
   name: 'shoplist',
   props:{
      datalist:{  
        //type:Array,
       default:()=>[]
     },
  },
  data () {
    return {
        dtheight:'500',  //窗口高度
        active:1,  //状态开关
        isactive:0, //状态开关
        mtk1:false,
        mtk1_form:{
            datalist:[]
        },
        my_pid:''
    }
  },
   components:{

  },
  created(){
     this.dtheight = window.innerHeight - 343
      
  },
  mounted (){
    
  },
  methods: {   
    mtk1_but(row){
        this.post("/product/infoForSomeone", {
              pid:row.pid 
	     }).then(res => {
             console.log(res.result)
             this.mtk1_form.datalist =  res.result.norms
         })
        this.mtk1 = true
    },
    switchchange(row){
        this.my_pid = row.pid
        if(row.status == 0){

          this.$confirm('是否下架?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                        this.post("/product/xiajia", {
                            pid:row.pid,
                        }).then(res => {

                            if(res.error_code == 0){
                            this.open1(res.result,'success')  //提示框
                            this.$emit('up_list_fun')
                            }else {
                            this.open1(res.message,'warning')
                        }

                })
            }).catch(() => {
                    this.$emit('up_list_fun') 
            });

        }else if(row.status == 1){

            this.$confirm('是否上架?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                        this.post("/product/shangjia", {
                            pid:row.pid,
                        }).then(res => {

                            if(res.error_code == 0){
                            this.open1(res.result,'success')  //提示框
                            this.$emit('up_list_fun')
                            }else {
                            this.open1(res.message,'warning')
                        }

                })
            }).catch(() => {
                    this.$emit('up_list_fun') 
            });

        }
     
    },
    delect_but(row){
        this.my_pid = row.pid
        if(row.status == 1){
            this.open1('请先下架商品','warning')
        }else{

           this.$confirm('是否删除?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                        this.post("/product/delete", {
                            pid:row.pid,
                        }).then(res => {

                            if(res.error_code == 0){
                            this.open1(res.result,'success')  //提示框
                            this.$emit('up_list_fun')
                            }else {
                            this.open1(res.message,'warning')
                        }

                })
            }).catch(() => {
                    this.$emit('up_list_fun') 
            });

        }
        
     },
     go_but(row){
         this.post("/product/infoForSomeone", {
              pid:row.pid 
	     }).then(res => {
             console.log(res.result)

            let fileList1=[]  //基础信息
            for(let item of res.result.cover_list) {
                    fileList1.push({"url": this.urlimg + item.cover })
            } 
            this.$store.state.product_data ={   
                pname:res.result.pname, //产品名称
                select_num1:res.result.cid, //分类id
                select_num2:res.result.is_push, // 是否推荐
                price:res.result.price,  //价格
                sale_count:res.result.sale_count, //商品月销
                describe:res.result.describe, //产品描述
                fileList:fileList1,
                phonearr:res.result.cover, //轮播图数组id
                head_img: this.urlimg + res.result.thumbnail, //商品封面图片
                upfile: res.result.thumbnail,  //商品封面url
            }  //基础结束信息
              

            let listdata1 = []  //产品规格
            for(let item of res.result.spec){  
                 listdata1.push({"name":item.name,"price":'',"tags":item.list})
            }
            this.$store.state.standards_data ={   //规格值
                 listdata:listdata1,
                 speclist:res.result.spec,
                //  norms:res.result.norms
            }  //产品规格
            

            this.$store.state.standards_details_data = res.result.norms
            
            

            //产品详情
            this.$store.state.productdetails_data = {
                content:res.result.content
            }
            

             this.$forceUpdate()
             this.$router.push({  
                path: '/index/shop/upwarehouse/basics',
                query: {
                    // name:this.user_name,
                    pid:row.pid
                }
             })


         })
         
        

     },


  }
}
</script>


<style scoped>

</style>